import { DoubleLeftOutlined } from '@ant-design/icons';
import { Collapse, InputNumber, Select } from 'antd';
import { useMemo } from 'react';
import IconFont from '@/components/IconFont';
import Style from '../../index.module.less';
import { useFilterFieldsConfig } from '../../store';
import FieldWrapper from '../FieldWrapper';
import { SelectRangeInput } from '../SelectRangeInput';
import {priceFilterItem} from '@/pages/OrderModule/orderList/components/Filter/constant.js';
const { Panel } = Collapse;

/**
 * @desc: 筛选框：金额/单价/重量组件
 */
export const Price = ({ value = {}, onChange, onPressEnter }) => {
  const { checkingMap } = useFilterFieldsConfig();
  const unitPrice = useMemo(() => {
    if (value.storeGoodsPrice === 0.01) {
      return 0.01;
    } else if (value.isVipGoods !== undefined) {
      return value.isVipGoods ? 1 : 0;
    } else {
      return undefined;
    }
  }, [value.storeGoodsPrice, value.isVipGoods]);
  const unitPriceOptions = [
    { label: '单价0.01元', value: 0.01 },
    { label: '有会员价', value: 1 },
    { label: '无会员价', value: 0 },
  ];

  const priceTypeOptions = [
    { label: '采购额', value: 'totalAmount' },
    { label: '商品金额', value: 'goodsAmount' },
    { label: '包材费', value: 'packAmount' },
    { label: '服务费', value: 'payServiceFee' },
    { label: '预估运费', value: 'estimateFreightAmount' },
    { label: '实付运费', value: 'ecShippingAmount' },
  ];

  const platformPriceTypeOptions = [
    // { label: '平台应付金额', value: 'ecReceivableAmount' },
    // { label: '平台运费', value: 'ecShippingAmount' },
    { label: '平台实付金额', value: 'ecActualPayment' },
  ];

  const triggerChange = (changedValue) => {
    onChange?.({ ...value, ...changedValue });
  };

  const handleUnitPriceChange = (v) => {
    if (v === 0.01) {
      triggerChange({ storeGoodsPrice: 0.01, isVipGoods: undefined });
    } else if (v === 1 || v === 0) {
      triggerChange({ storeGoodsPrice: undefined, isVipGoods: v });
    } else {
      triggerChange({ storeGoodsPrice: undefined, isVipGoods: undefined });
    }
  };
  if(Object.values(priceFilterItem).every(item => checkingMap[item] === false)) {
    return null
  }
  return (
    <Collapse
      bordered={false}
      expandIcon={({ isActive }) => <DoubleLeftOutlined rotate={isActive ? 270 : 90} style={{ fontSize: '16px', color: '#4E5969' }} />}
      expandIconPosition="end"
      className={Style['filter-item-collapse']}
      defaultActiveKey={['price']}
    >
      <Panel header="金额/单价/重量" key="price" className={Style['filter-item-collapse-panel']}>
        {/** 采购价 */}
        {checkingMap.unitPrice && (
          <FieldWrapper>
            <Select value={value.unitPrice} allowClear placeholder="选择采购价" options={unitPriceOptions} onChange={handleUnitPriceChange} clearIcon={<IconFont type="iconguanbi2fill" style={{fontSize:'14px'}} />} />
          </FieldWrapper>
        )}

        {/** 金额 */}
        {checkingMap.totalAmount && (
          <SelectRangeInput
            options={priceTypeOptions}
            defaultSelectValue={'totalAmount'}
            value={value}
            onChange={(e) => {
              triggerChange(e);
            }}
            onPressEnter={onPressEnter}
          ></SelectRangeInput>
        )}

        {/** 平台金额 */}
        {checkingMap.ecReceivableAmount && (
          <SelectRangeInput
            options={platformPriceTypeOptions}
            defaultSelectValue={'ecActualPayment'}
            value={value}
            onChange={(e) => {
              triggerChange(e);
            }}
            onPressEnter={onPressEnter}
          ></SelectRangeInput>
        )}

        {/** 重量 */}
        {checkingMap.weight && (
          <FieldWrapper label="重量">
            <div style={{ display: 'flex', justifyContent: 'space-between' }}>
              <InputNumber
                value={value.weightMin}
                width={36}
                controls={false}
                min={0}
                placeholder="请输入kg"
                onChange={(e) => {
                  triggerChange({ weightMin: e });
                }}
                onPressEnter={onPressEnter}
              />
              <span className="input-bettwen-line">-</span>
              <InputNumber
                value={value.weightMax}
                width={36}
                controls={false}
                min={0}
                placeholder="请输入kg"
                onChange={(e) => {
                  triggerChange({ weightMax: e });
                }}
                onPressEnter={onPressEnter}
              />
            </div>
          </FieldWrapper>
        )}
      </Panel>
    </Collapse>
  );
};

export default Price;
